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Motivation 


Motivation 

¢ Visualize large data sets 

¢ Make comparisons between different “runs” 
¢ Extract knowledge and understanding 


Inspired by NASA Ames NAS computer system hyperwall created in 2002 
¢ Scalable concurrent visualization of Tyohoon Morakot from different 
perspectives at the same time (left) 
¢ Visualize large simulations (right) 
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Motivation (continued) 


¢ CFD and Wind Tunnel tests typically have large run matrices 
¢ Wanted to extract knowledge and understanding from gobs of data 
¢ Needed a better way to view results buried in a bunch of folders 
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Motivation (continued) 


The MiniWall 

¢ Provides for easy and interactive 
data exploration (slice & dice) 

¢ Allows many images to be 
displayed simultaneously 

¢ Displays results in the natural 
context of the test — i.e. Mach 
versus AoA 

¢ Allows drilling down into the data 

¢ Share the data with others and 
enable them to explore the data 
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Software History Ss 


¢ Originally written in 2006 by John Melton in Microsoft's ActiveX and JavaScript 
software. Only ran on Windows computers. 

¢ Paul Stremel rewrote it several years later using JavaScript. This enabled 
MiniWall to run many different kinds of computes and devices. 

¢ Michael Schuh rewrote it in 2016 to use JavaScript objects and added several 
new features. Started serving up the pages using webserver nginx and https. 


SLS Venting Project Ss 


¢ The images in the paper and demonstration are from the NASA Space Launch 
System (SLS) venting project 
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How to View a MiniWall 


¢ MiniWall can be opened from a local html file or URL 


File J) images 12/8/2016 1:36 PM __File folder 
iaeaccri 12/8/2016 1:36PM File folder 


_© miniwall_aurora.html! 12/2/2016 6:25 PM Chrome HTML Do... 
__} READ 


URL example, the MiniWall below is being served by an HTTP server through an SSH 
tunnel. The page requires a user name and password to be accessed. 
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€ > A bettps://localhost:4569/projects/20141029_Venting/html/miniWall/Vehicle/miniwall_vent_object.htm| 
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Main Image Table 


Multi-image Window 
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Three Main Views 
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Multi-image Window 
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Main-Image Table Ss 


¢ User first sees the Main-Image Table 
¢ CFD simulations of a honeycomb vent design analyzed for the Space Launch 


Pressure Ratio 


System (SLS) rocket 


(Different vent 
diameters) 


Mach Number 


Main-lmage Table Controls 


= 


¢ Controls are located at the bottom of the screen 
¢ Also controlled by the mouse and keyboard 
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Solution _Mach_closeUpRight All Next | Reset | Help 


Image Selection Configuration 


Mach Number 
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Main-lmage Table Controls 


Columns and rows can be hidden by clicking on the column or row title 
The “u” key unhides all hidden columns and rows 
Clicking on pink squares unhides a hidden column or row 
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Three Main Views 
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Multi-lmage Window Ss 


¢ Shows all available images for a data set in main image table 
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Single-lmage Window 


¢ Shows large view of image from main image table or multi-image window 
¢ Use “Shift-left-mouse’” click to open an image in a single-image window 
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Use “h” key for “help” 


Key and/or Mouse Click 
a 
j 
J 
Right-Arrow 
Left-Mouse-Click 
h 
k 
K 
1 
5 
Ctrl-Left-Mouse-Click 
Left-Arrow 
Shift-Left-Mouse-Click 
Shift-Alt-Left-Mouse-Click 
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Left-Click on row or column title 
oOo 

Multi-Image Window 
Shift-Left-Mouse-Click 
Left-Mouse-Click 


MiniWall Help 


Brief list of keys for controling the MiniWall behavior 


Action 
Show or hide all of the images that did not load in a multi-rmage window 
Next image 
Reduce the image scale by 1% 
Next image 
Next image (only for the clicked image) 
This help message 
Previous image 
Increase the image scale by 1% 
Link all of the single image windows together so that they all show the same image. Currently false. 
Link images together in all of the single image windows and the main image window so that they all show the same image. Currently false. 
Previous image (only for the clicked image) 
Previous image 
Open a new window with the current image. Works in main image table and multi-image windows. 
Open a new multi-image window with all of the images for the image selected 
Raise all of the single image windows. This will bring them to the top in the order they were opened. 
Close the current help or single image window 
Close all of the single image and help windows 
For the main table window. reset the mages to have the original image size of 40%. For the single image windows. reset the size to 100% 
Link or unlink all of the single image windows resize events together. Currently false with size undefined. 
Transpose the table 
Unhide all of the hidden rows and columns in the main image table 
Hide all of the images in the given row or column 
Unhide all of the images in the next or previous row or column. The yellow box is only present when a column or row is hiden. 


Open a new single image window with the current image. Works in main image table and multi-image windows. 

Set the image in the main image table to the selected image by default. If the "1" link single images option 1s active. then set the images in the single 
image windows to the selected image. If the "L" link all images option is active. then set the images in the single image windows and the main image 
window to the selected image. 


Configuration — MiniWall.html 
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MiniWall.html file is used to make main-image table 
Specifies two JavaScript files used to setup and run the MiniWall 
Has a few configuration parameters 


<HTML> 
<HEAD> 
<script src="javascripts/utils_object.js"> </script> Moy Tels) iials 
<script src="javascripts/setup_vent_object.js"> </script> ' ' 
amie: SEeW7-teteig] eo) mil(=s5 
/* 
* Michael Schuh 
* NASA Ames Research Center Code AA 
* Moffett Field, CA 94035 
* 
* MiniWaLll Software 
* 2016-04-14 Version 2.1 Inspired by the MiniWall created by John Melton in 2006 and reworked by Paul Stremal 
a 
// Initial values to select the inital image and scaling of the images. 


// The first index in a list is "0" 
initial_image_index = 205; regs 
initial_size in percent = 25; Sets some initial values 
initial_selected_configuration_index = 0; 

initial_selected_mach_number_index = 0; 

miniwall_page_tab_name = "Venting MiniWall"; 

// Tell the utils_object.js tools what type of miniwall controls to use 

miniwall_type = "venting"; 
</SCRIPT> 

</HEAD> 


<BODY onLoad="createObjectTablePage();"> </BODY> me)a| meysle ie laaksiuarere| (ol tsts] ists) 


</HTML> 
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Configuration — Setup_vent_object.html 


¢ Defines lists of data sets, column values, image names, and other control options 


1 // MiniWall setup parameters 

2 var row_data_sets = []; 

3 // Mach 0.9 

4 row_data_sets.push("Sqr7.2ha45ptlhw4. Shs. 1875:MachO. 9:Pte77136:Tte320:TratO.85:BLVer0O. 9- Aa: Base4.0:Mesh2. 20:Pr112Str1.075bl12_Coupled"); 

5 row_data_sets.push("Sqr5.091ha45pt 1hw4. ShsO. 1875: MachO. 9:Pte77136:Tte320:Trat0.85: -075b112_Coupled"); 
6 row_data_sets.push("Sqr5.091ha45pt1lhw4.ShsO. 1875: MachO. 9:Pte77136:Tte320:TratO.85: M = = .075b112_Coupled"); 
7 // Mach 1.4 relia Haarelele 

8 row_data_sets.push("Sqr7. 2ha4Sptlhw4.ShsO. 1875:Mach1.4:Pte73711:Tte320:TratO.85:BL 75b114_ Coupled"); 


o 


row_data_sets.push("Sqr5S.091ha45pt lhw4. ShsO. 1875: Mach1.4:Pte73711:Tte320:Trat0.85: 
10 row_data_sets.push("Sqr5.091ha45ptlhw4. ShsO. 1875:Mach1. 4: Pte73711:Tte320:TratO.85: 
11 [lines not shown] 

12 

13 var column_values = []; 


14 column_values.push("1.02"); Mai al Taakelers) 


15 column_values.push("1.05"); 
16 column_values.push("1.10"); 
17 column_values.push("1.20"); irlel[~ Co ) m Nn S 


18 [lines not shown] 


.075b114 Coupled"); 
.075b114_ Coupled"); 


table Rows 
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20 var configuration_basename=" 20141029 FML"; // configuration name 

21 var column_label_prefix="Prat"; // X-axis label (A for AoA, etc. ) 
22 var image_filename_extension="png"; 

23 


24 var 1mage_extension_names ="\ 
25 [lines not shown] 

26 Solution_Mach \ 

27 Solution_Mach_closeUpRight \ 

| closeUpRightMesh \ 


Image Names 


28 Solution_Mach 
29 Solution_Mach_closeUpTop \, 

30 Solution_Mach_closeUpTopMesh \ 
31 [lines not shown] 

32 \ 

33°; 

34 

35 var configurations = new Array(); - 7 ; 7 

36 configurations.push("All"); Main Haarclele its le){s) (CZolarilelUlelivelal 
37 configurations.push("Sqr3.6ha45ptlhw4.5hs0. 1875"); 
38 configurations.push("Sqr5.091ha45pt lhw4.ShsO. 1875"); 

39 configurations.push("Sqr7. 2ha45ptlhw4.Shs0. 1875"); selector values 
40 

41 var mach_numbers = new Array(); 


eal ereotenet yy Main image Mach 
Number selector values 20 


44 mach numbers.push("1.4"); 


Summary & Conclusions Ss 


¢ Easy to work, share, and collaborate on large data sets 

¢ Provides intuitive access to non-experts 

¢ Transforms data into knowledge and understanding 

¢ Enables viewing the data in the natural context of the test 
¢ Runs on many devices 


¢ Data can be served remotely and protected by SSH and 
passwords 


¢ Can be used with any data that can be displayed in an 
HTML page 

¢ Investigating the software release process to make the 
MiniWall available 
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